<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
  <!--/*--> 引入css、jq、layui等样式、js <!--*/-->
  <meta th:include="~{layout/layout_hread :: head}">
</head>
<body>
<div class="layui-form" id="box" style="margin-top: 10px;">
  <div class="layui-form-item">
    <label class="layui-form-label">
      角色名
    </label>
    <div class="layui-input-inline">
      <input type="text" id="roleName" name="roleName" required="" lay-verify="required" disabled
             title="不可编辑" th:value="${permission.roleName}" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">
      授权资源
    </label>
    <div class="layui-input-inline">
      <input type="text" id="source" name="source" required="" lay-verify="required"
             th:value="${permission.source}" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-form-mid layui-word-aux">
      要求要求符合URL、URL表达式（AntPathMatcher）
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">
      读写权限
    </label>
    <div class="layui-input-block">
      <input type="checkbox" name="action[r]" title="读权限-r" th:checked="actionR">
      <input type="checkbox" name="action[w]" title="写权限-w" th:checked="actionW">
    </div>
  </div>
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">
      角色描述
    </label>
    <div class="layui-input-block" style="width: 350px;">
      <textarea id="description" name="desc" placeholder="请输入角色描述" class="layui-textarea">[[${permission.description}]]</textarea>
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="edit">立即提交</button>
    </div>
  </div>
</div>
<script>
  layui.use(['form', 'jquery'], function () {
    var form = layui.form;
    var $ = layui.jquery;
    var layer = layui.layer;

    //监听提交
    form.on('submit(edit)', function (data) {
      var temp = data.field
      var action = ''
      for (var k in temp) {
        if (k == 'action[r]') {
          action = action + 'r'
        }
        if (k == 'action[w]') {
          action = action + 'w'
        }
      }
      temp.action = action
      $.post({
        data: temp,
        url: '/admin/permissionEdit',
        success(data) {
          layer.msg(data.message)
        }
      })
      return false;
    });
  });
</script>
</body>
</html>
